$(function () {
	// Settings up the tree - using $(selector).jstree(options);
	// All those configuration options are documented in the _docs folder
  $.jstree._themes = '../external/javaScripts/jstree/1.0/themes/';
   
	$("#browse")
		.jstree({ 
			// the list of plugins to include
			"plugins" : [ "themes", "json_data", "ui", "crrm", "cookies", "dnd", "search", "types", "hotkeys",  ],
			// Plugin configuration

			// I usually configure the plugin that handles the data first - in this case JSON as it is most common
			"json_data" : { 
				// I chose an ajax enabled tree - again - as this is most common, and maybe a bit more complex
				// All the options are the same as jQuery's except for `data` which CAN (not should) be a function
				"ajax" : {
					// the URL to fetch the data
					"url" :'',
					// this function is executed in the instance's scope (this refers to the tree instance)
					// the parameter is the node being loaded (may be -1, 0, or undefined when loading the root nodes)
					"data" : function (n) { 
						// the result is fed to the AJAX request `data` option
						return { 
							"operation" : "get_children", 
							"id" : n.attr ? n.attr("id").replace("node_","") : 1 
						}; 
					}
				}
			},
			// Configuring the search plugin
			"search" : {
				// As this has been a common question - async search
				// Same as above - the `ajax` config option is actually jQuery's object (only `data` can be a function)
				"ajax" : {
					"url" : "./serveddr.php",
					// You get the search string as a parameter
					"data" : function (str) {
						return { 
							"operation" : "search", 
							"search_str" : str 
						}; 
					}
				}
			},
			// Using types - most of the time this is an overkill
			// Still meny people use them - here is how
			"types" : {
				// I set both options to -2, as I do not need depth and children count checking
				// Those two checks may slow jstree a lot, so use only when needed
				"max_depth" : -2,
				"max_children" : -2,
        "select_limit": 1,
				// I want only `drive` nodes to be root nodes 
				// This will prevent moving or creating any other type as a root node
				"valid_children" : [ "drive" ],
				"types" : {
					// The default type
					"class" : {
						// I want this type to have no children (so only leaf nodes)
						// In my case - those are files
						"valid_children" : "none",
						// If we specify an icon for the default type it WILL OVERRIDE the theme icons
						"icon" : {
							"image" : $('#classImg').html()
						}
					},
					// The `folder` type
					"folder" : {
						// can have files and other folders inside of it, but NOT `drive` nodes
						"valid_children" : [ "default", "folder" ],
						"icon" : {
							"image" : $('#folderImg').html()
						}
					},
					// The `drive` nodes 
					"drive" : {
						// can have files and folders inside, but NOT other `drive` nodes
						"valid_children" : [ "default", "folder" ],
						"icon" : {
							"image" : $('#rootImg').html()
						},
						// those options prevent the functions with the same name to be used on the `drive` type nodes
						// internally the `before` event is used
						"start_drag" : false,
						"move_node" : false,
						"delete_node" : false,
						"remove" : false
					}
				}
			},
			// For UI & core - the nodes to initially select and open will be overwritten by the cookie plugin

			// the UI plugin - it handles selecting/deselecting/hovering nodes
			"ui" : {
				// this makes the node with ID node_4 selected onload
				"initially_select" : [ "node_2" ]
			},
			// the core plugin - not many options here
			"core" : { 
				// just open those two nodes up
				// as this is an AJAX enabled tree, both will be downloaded from the server
				"initially_open" : ["node_2"] 
			}
		})
		.bind("select_node.jstree", function (e, data) {
      if(data.args[1] != undefined) {
        element = data.args[0];
        select = $('.jstree-clicked').html().slice(37);
        console.log(select);
        $('#cTitle').html(select);
        if(select.charAt(0) == ' ') {
          select = jQuery.trim(select);
          

          var JSONOObject = [select];
          var JSONOString = JSON.stringify(JSONOObject);
          
          AJAXRequest(
              'iJInfo', 
              'getClassInfo', 
              JSONOString, 
              
              function log(data) {
                  
                  
                  //$('div.code').html('');
                  $('div.highlight.php').html('<pre class="code" lang="php"></pre>');
                  $('pre.code').html(data.code);
                  $('pre.code').highlight({source:1, zebra:1, indent:'space', list:'ol'});
                  displayDoc(data.doc);
                  console.log(data);
                  
              },
              
              function log(data) {
                 // console.log(data);
              }
          );
        }
      }
      
      

			/*$.post(
				"", 
				{ 
					"operation" : "select_node", 
					"id" : data.rslt.parent.attr("id").replace("node_",""), 
					"position" : data.rslt.position,
					"title" : data.rslt.name,
					"type" : data.rslt.obj.attr("rel")
				}, 
				function (r) {
					if(r.status) {
						$(data.rslt.obj).attr("id", "node_" + r.id);
					}
					else {
						$.jstree.rollback(data.rlbk);
					}
				}
			);*/
		})
		.bind("remove.jstree", function (e, data) {
			data.rslt.obj.each(function () {
				$.ajax({
					async : false,
					type: 'POST',
					url: "./server.php",
					data : { 
						"operation" : "remove_node", 
						"id" : this.id.replace("node_","")
					}, 
					success : function (r) {
						if(!r.status) {
							data.inst.refresh();
						}
					}
				});
			});
		})
		.bind("rename.jstree", function (e, data) {
			$.post(
				"./server.php", 
				{ 
					"operation" : "rename_node", 
					"id" : data.rslt.obj.attr("id").replace("node_",""),
					"title" : data.rslt.new_name
				}, 
				function (r) {
					if(!r.status) {
						$.jstree.rollback(data.rlbk);
					}
				}
			);
		})
		.bind("move_node.jstree", function (e, data) {
			data.rslt.o.each(function (i) {
				$.ajax({
					async : false,
					type: 'POST',
					url: "./server.php",
					data : { 
						"operation" : "move_node", 
						"id" : $(this).attr("id").replace("node_",""), 
						"ref" : data.rslt.np.attr("id").replace("node_",""), 
						"position" : data.rslt.cp + i,
						"title" : data.rslt.name,
						"copy" : data.rslt.cy ? 1 : 0
					},
					success : function (r) {
						if(!r.status) {
							$.jstree.rollback(data.rlbk);
						}
						else {
							$(data.rslt.oc).attr("id", "node_" + r.id);
							if(data.rslt.cy && $(data.rslt.oc).children("UL").length) {
								data.inst.refresh(data.inst._get_parent(data.rslt.oc));
							}
						}
						$("#analyze").click();
					}
				});
			});
		});
    
    $("#browse").jstree("set_theme","apple");
    $('pre.code').highlight({source:1, zebra:1, indent:'space', list:'ol'});
    
  
   


});
function displayDoc(ClassInfo) {
  $('#cSubTitle').each(function(){
    console.log('1');
      $(this).css('display', 'block');
  });
  
  $('#description').html(ClassInfo.Description);
  $('#copyright').html(ClassInfo.copyright);
  
  $vardoc = $('.cVarDoc');
  $vardoc.html('');
  for (var key in ClassInfo.variables) {
      var val = ClassInfo.variables[key];
      $vardoc.append("<div id='docTitle'> " + key + ":</div>");
      for (var property in val) { 
        var Pvalue = val[property];
        $tab = "&nbsp;";
        for(i = property.length; i <16; i++ ) {
          $tab = $tab + "&nbsp;"
        }
        $vardoc.append("<div id='docText'><pre>" + property +  ":" + $tab + Pvalue + "</pre></div>");
      }
      
       
      $vardoc.append("</br>");                 
      $vardoc.append("<div class='clrd'></div>");
  }
  
  $vardoc = $('.cMethodsDoc'); 
  $vardoc.html('');
  for (var key in ClassInfo.methods) {
      var val = ClassInfo.methods[key];
      $vardoc.append("<div id='docTitle'>" + key + ":</div>");
      for (var property in val) { 
        var Pvalue = val[property];
        $tab = "&nbsp;";
        for(i = property.length; i <16; i++ ) {
          $tab = $tab + "&nbsp;"
        }
        $vardoc.append("<div id='docText'><pre>" + property +  ":" + $tab + Pvalue + "</pre></div>");
      }
      
       
      $vardoc.append("</br>");                 
      $vardoc.append("<div class='clrd'></div>");
  }

  
}